<template>
  <div>
    <p>{{ arr }}</p>
    <p>总和：{{ arr.reduce((prev,val)=>prev+val) }}</p>
    <p>总和：{{ sum1() }}</p>
    <p>总和：{{ sum1() }}</p>
    <p>总和：{{ sum2 }}</p>
    <p>总和：{{ sum2 }}</p>
    <p>
      请输入你的姓：<input type="text" v-model="firstName">
      请输入你的名：<input type="text" v-model="lastName">
      你好，<input type="text" v-model="name">
    </p>
  </div>
</template>

<script>
export default {
  data(){
    return {
      arr: [45,56,53,47,38],
      firstName: "",
      lastName: "",
    }
  },
  methods:{
    sum1(){
      console.log(1);
      return this.arr.reduce((prev,val)=>prev+val);
    }
  },
  computed:{
    sum2(){
      console.log(2);
      return this.arr.reduce((prev,val)=>prev+val);
    },
    name:{
      get(){
        return this.firstName + this.lastName;
      },
      set(val){
        this.firstName = val[0] || "";
        this.lastName = val.slice(1) || "";
      }
    }
  }
}
</script>